// 1.增加订单
document.getElementById("addBtn").onclick=function(){
  //1.获取书名，数量，单价，计算总价
  var bookName=document.getElementById("bookName").value
  var num=document.getElementById("num").value
  var price=document.getElementById("price").value
  // if (bookName&&num&&price){
  var totalPrice=Number(num)*Number(price)
  // 2.构造一个新的行，插入表格中
  var table=document.querySelector(".style-table")
  //插入新行的方式一
  var tr=table.insertRow(-1)
  var trHtml=`
  <td class="n">${bookName}</td>
  <td>${num}</td>
  <td>￥${price}</td>
  <td>${totalPrice}</td>
  <td>
    <input type="button" value="修改数量" onclick="changeOper(this)"/>
    <input type="button" value="删除物品" onclick="delectOper(this)"/>
  </td>
  `
  tr.innerHtml=trHtml
  // console.log(table.children)
  // 插入新行的方式二
  // var newRow = document.createElement("tr")//创建新行节点
  // newRow.innerHTML=trHtml//修改新行节点的内容
  // table.children[1].appendChild(newRow)//将新行节点加到表格的tbody最后
  // }
}
//修改数量:找到对应的tr,将tr里面的某些td的内容修改
function changeOper(obj){
  // 点击“修改数量”
  if(obj.value=="修改数量"){
  //1.获取数量对应的td
  var numTd = obj.parentNode.parentNode.children[1]
  //2.获取旧的数量
  var num=numTd.innerHTML
  //3.构建input输入框，value值等于数量值
  var input=`<input type="text value="${num} class="modify" />`
  numTd.innerHTML=input
  //4.“修改数量”改为“确认修改”
  obj.value="确认修改"
}else{
  //点击“确认修改”
  //1.获取新的数量并修改td的数量值
  var newNum = obj.parentNode.parentNode.children[1].firstElementChild.value
  obj.parentNode.parentNode.children[1].innerHTML=newNum
  //2.计算新的总价并修改td的总价量
  var renPrice=obj.parentNode.parentNode.children[2].innerHTML
  var price=renPrice.substr(1)
  console.log(renPrice,price)
  var newTotalPrice=Number(newNum)*Number(price)
  obj.parentNode.parentNode.children[3].innerHTML= newTotalPrice
  //3.“确认修改”改为“修改数量”
  obj.value="修改数量"
}
}
//删除信息
// 删除信息:找到对应的tr,并从表格中删除
function delectOper(obj){
  // 获取当前行
  var tr = obj.parentNode.parentNode;
  // 获取表格
  var table = document.querySelector(".style-table");
  // 从表格中删除行
  table.children[1].removeChild(tr);
}
var nav=document.querySelectorAll(".nn li")
nav.forEach(item=>{
	item.onmousemove=()=>{
		nav.forEach(i=>{
			i.classList.remove("aaa")
		})
		item.classList.add("aaa")
	}
	item.onmouseout=()=>{
		item.classList.remove("aaa")
	}
})
var  wl1=document.querySelector(".wl1")
if(localStorage.getItem('name')!=null){
	wl1.innerHTML=`${localStorage.getItem('name')}`
}

function checkByName() {
  // 获取搜索输入框的值
  var sea = document.getElementById('nam').value;
  
  // 获取表格的所有行
  var rows = document.querySelectorAll('.trr tr');
  
  // 遍历所有行，并根据搜索词显示或隐藏它们
  rows.forEach(itme => {
      // 获取书名单元格
      const na = itme.querySelector('.n');
      
      // includes() 方法直接用于检查书名单元格的 textContent 是否包含这个搜索词
      if (na && na.textContent.includes(sea)) {
        itme.classList.remove('hidden');
      } else {
          // 否则隐藏该行
          itme.classList.add('hidden');
      }
  });
}